<template>
    <view :style="{background:tksetting.color,minHeight:'100vh'}">
		<u-navbar back-text=""
			:leftIconColor="tksetting.titlecolor" 
			:bgColor="tksetting.color" 
			:titleStyle="{color:tksetting.titlecolor}" 
			:title="title"  
			:autoBack="true"
			:placeholder="true">
		</u-navbar>
		<u--image
			mode="widthFix" :src="head_img" width="100%"  height="auto" >
		</u--image>
		<q-turntable ref="turntable" @start="turntableStart" @success="turntableSuccess"></q-turntable>
		<view style="padding: 40rpx; ">
			<view style="background: #fff; border-radius: 20rpx; padding: 20rpx; height: 150rpx; overflow-y:scroll;">
				<view style="padding:10rpx 40rpx;" v-for="(item,index) in zjlist" :key="index">
					{{item.name}}  奖品: {{item.jx}} {{item.t}}
				</view>
			</view>
		</view>
	</view>
</template>
<script>
import {toast, clearStorageSync, setStorageSync, getStorageSync, useRouter} from '@/utils/utils.js'
import { mapState } from 'vuex';
import BASE_URL from '@/api/env.js' //引入接口共用地址
export default {
  data() {
    return {
	  title:'幸运大转盘',
      award:1,
	  zjlist:[
		{name:'张*三',jx:'一等奖',t:'2025-06-25'},
		{name:'李*四',jx:'一等奖',t:'2025-06-25'},
		{name:'王*',jx:'三等奖',t:'2025-06-25'}
	  ],
      awardList: [
        {
            title: '特等奖',
			types:1
        },
        {
            title: '一等奖',
			types:1
        },
        {
            title: '二等奖',
			types:1
        },
        {
            title: '三等奖',
			types:1
        },
        {
            title: '四等奖',
			types:1
        },
        {
            title: '谢谢参与',
			types:0
        }
      ] // 顺时针对应每个奖项 

    };
  },
	 computed: {
		...mapState(['tksetting']),
		head_img(){
			let url=BASE_URL.replace("/Api.php", "");
			return url+'/Public/images/choujiang.png?t=2'
		}
	 },
  methods: {
    // 用户点击开始抽奖
    turntableStart() {
	
	  this.$api.choujiang().then(res=>{
		//let index = Math.floor(Math.random() * 6 + 1) //前端随机数，这里应该后台返回中奖结果
		if(res.code==0){
			this.award = res.data
			this.$refs.turntable.begin(this.award);
			//this.awardnum=this.awardnum>0?this.awardnum-1:0;  
		}else{
			uni.showModal({
				title:'系统提示',
				content:res.msg,
				showCancel:false
			})
		}
	  })
	  
    },

    // 抽奖完成后操作
    turntableSuccess() {
      const index = this.award - 1;
      //console.log('bind:success', this.awardList[index]);
	  let title=this.awardList[index].types==1?`恭喜你获得${this.awardList[index].title}`:`未中奖,感谢参与!`
      toast(title)
    },

  }
}
</script>